<template>
    <div class='sort'>
        <div class='sort-title'>字母排序</div>
        <ul class='sort-list'>
            <li class='sort-item' v-for="(val,key) in cities">{{key}}</li>
        </ul>
    </div>
</template>
<script type="text/javascript">
export default{
    props:['cities']
}
</script>
<style scoped>
    .sort{
        background:#f5f5f5;
    }
    .sort-title{
        font-size:.24rem;
        color:#212121;
        padding:.2rem .3rem;
    }
    .sort-list{
        position: relative;
        overflow: hidden;
        background: #fff;
        font-size:.28rem;
        color:#212121;
    }
    .sort-item{
        width:16.666666%;
        text-align: center;
        height:.9rem;
        line-height: .9rem;
        float:left;
        border-bottom:.02rem solid #ddd;
    }
</style>